<template>
	<view>
		<Header title="坚果收购"></Header>
		<view class="main_wrap">
			<view class="main">
				<view class="main_item">
					<view>选择被收购的种植户:</view>
					<van-row>
						<xfl-select :list="list" :clearable="false" :showItemNum="5" :isCanInput="true"
							:style_Container="'height: 70rpx; font-size: 26rpx;'" placeholder="输入手机号检索用户"
							:initValue="'13321713857'" :selectHideType="'hideAll'">
						</xfl-select>
					</van-row>
				</view>
				<view class="main_item">
					<view>收购日期:</view>
					<van-row>
						<xfl-select :list="list" :clearable="false" :showItemNum="5" :isCanInput="true"
							:style_Container="'height: 70rpx; font-size: 26rpx;'" placeholder="选择日期"
							:selectHideType="'hideAll'">
						</xfl-select>
					</van-row>
				</view>
				<view class="main_item">
					<view>收购人员:</view>
					<van-row>
						<xfl-select :list="list" :clearable="false" :showItemNum="5" :isCanInput="true"
							:style_Container="'height: 70rpx; font-size: 26rpx;'" placeholder="系统自动检索用户"
							:selectHideType="'hideAll'">
						</xfl-select>
					</van-row>
				</view>
				<view class="main_item">
					<view>是否为代收:</view>
					<van-row>
						<van-radio-group :value="radio" style="display: flex;">
							<van-radio name="1">是</van-radio>
							<van-radio name="2">否</van-radio>
						</van-radio-group>
					</van-row>

				</view>
				<view class="main_item">
					<view>请上传代收委托书:</view>
					<van-row>
						<van-uploader file-list="fileList" bind:after-read="afterRead" preview-image upload-icon="photo"
							:preview-full-image="true">

						</van-uploader>
					</van-row>
				</view>

				<view class="main_item">
					<view>是否公开收购方信息:</view>
					<van-radio-group :value="radio" style="display: flex;">
						<van-radio name="1">是</van-radio>
						<van-radio name="2">否</van-radio>
					</van-radio-group>
				</view>

				<view class="main_item">
					<view>收购方信息:</view>
				</view>
				
				<view class="main_item">
					<van-row>
						<van-col span="8">
							<view style="line-height: 72rpx;">收购方名称:</view>
						</van-col>
						<van-col span="16">
							<van-cell-group>
							  <van-field
							    placeholder="请输入用户名"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row>
						<van-col span="8">
							<view style="line-height: 72rpx;">组织机构代码:</view>
						</van-col>
						<van-col span="16">
							<van-cell-group>
							  <van-field
							    placeholder="请输入18位组织机构代码"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row>
						<van-col span="8">
							<view style="line-height: 72rpx;">法定代表人:</view>
						</van-col>
						<van-col span="16">
							<van-cell-group>
							  <van-field
							    placeholder="请输入法定代表人名称"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row>
						<van-col span="8">
							<view style="line-height: 72rpx;">联系电话:</view>
						</van-col>
						<van-col span="16">
							<van-cell-group>
							  <van-field
							    placeholder="请输入11位手机号码"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				
				<view class="main_item">
					<van-row>
						<van-col span="24">
							<view style="line-height: 72rpx;">联系地址:</view>
						</van-col>
					</van-row>
					<van-row>
						
							<xfl-select :list="list"   :clearable="false" :showItemNum="5" :isCanInput="true"
								:style_Container="'height: 70rpx; font-size: 26rpx;margin-bottom:20rpx'" placeholder="省份"
								:selectHideType="'hideAll'">
							</xfl-select>
						
						
					</van-row>
					<van-row>
						<xfl-select :list="list" :clearable="false" :showItemNum="5" :isCanInput="true"
							:style_Container="'height: 70rpx; font-size: 26rpx;margin-bottom:20rpx'" placeholder="城市"
							:selectHideType="'hideAll'">
						</xfl-select>
					</van-row>
					<van-row>
						<xfl-select :list="list" :clearable="false" :showItemNum="5" :isCanInput="true"
							:style_Container="'height: 70rpx; font-size: 26rpx;margin-bottom:20rpx'" placeholder="区县"
							:selectHideType="'hideAll'">
						</xfl-select>
					</van-row>
					<van-row>
						<van-col span="24">
							<van-cell-group>
							  <van-field
							    placeholder="请输入详细地址"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				
				
				
				
				<view class="main_item">
					<view class="mb20">坚果品质:</view>
					<van-row>
						<van-checkbox-group style="display: flex;justify-content: flex-start;flex-wrap: wrap;"
							:value="result" @change="onChange">
							<van-checkbox  checked-color="#000" name="a">大果</van-checkbox>
							<van-checkbox  checked-color="#000" name="b">中果</van-checkbox>
							<van-checkbox  checked-color="#000" name="c">小果</van-checkbox>
							<van-checkbox  checked-color="#000" name="d">不区分</van-checkbox>
											
						</van-checkbox-group>
					</van-row>
				</view>
				<view class="main_item">
					<van-row gutter="20">
						<van-col span="12">
							<view class="mb20">大果单价:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入单价"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
						
						<van-col span="12">
							<view class="mb20">大果数量:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入大果数量"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row gutter="20">
						<van-col span="12">
							<view class="mb20">中果单价:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入中果单价"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
						
						<van-col span="12">
							<view class="mb20">中果数量:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入中果数量"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row gutter="20">
						<van-col span="12">
							<view class="mb20">小果单价:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入小果单价"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
						
						<van-col span="12">
							<view class="mb20">小果数量:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入小果数量"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row gutter="20">
						<van-col span="12">
							<view class="mb20">不区分单价:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入单价"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
						
						<van-col span="12">
							<view class="mb20">不区分数量:</view>
							<van-cell-group>
							  <van-field
							    placeholder="请输入数量"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				<view class="main_item">
					<van-row>
						<view class="mb20">合计金额:</view>
						<van-col span="24">
							<van-cell-group>
							  <van-field
							    placeholder="单行输入"
							    :border="false"
							  />
							</van-cell-group>
						</van-col>
					</van-row>
				</view>
				

				<van-row>
					<van-button type="info" size="normal"
						custom-style="display:flex;justify-conetent:center;width:400rpx;margin-top:60rpx">确定
					</van-button>
				</van-row>


			</view>
		</view>
	</view>
</template>

<script>
	import Header from "../../components/header.vue"
	import xflSelect from '../../components/xfl-select/xfl-select.vue'; //导入
	export default {
		data() {
			return {
				list: [ //要展示的数据
					'苹果',
					{
						value: '香蕉',
						disabled: true
					},
					'葡萄',
					'芒果',
					'大白菜',
				],
				radio: true,
				fileList: [{
						url: 'https://img.yzcdn.cn/vant/leaf.jpg',
						name: '图片1',
					},
					// Uploader 根据文件后缀来判断是否为图片文件
					// 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明
					{
						url: 'http://iph.href.lu/60x60?text=default',
						name: '图片2',
						isImage: true,
						deletable: true,
					},
				],
				value: '',
				checked: true,
				result: ['a', 'b'],
			}
		},
		components: {
			Header,
			xflSelect
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .van-radio {
		margin-right: 50rpx;
	}

	/deep/ .van-uploader__upload {
		width: 320rpx !important;
		height: 200rpx !important;
		border-radius: 15rpx;
		background-color: #e8e8e8;
	}
	/deep/ .van-checkbox{
		margin-right: 20rpx !important;
	}
	.mb20{
		margin-bottom: 20rpx;
	}
	

	.main_wrap {
		padding: 20rpx 20rpx 0 10rpx;

		.main {
			// height: 500rpx;
			border: 1px solid red;
			padding: 30rpx 20rpx 80rpx 20rpx;

			.main_item {
				margin-bottom: 20rpx;
				font-size: 26rpx;

				&>view {
					margin-bottom: 20rpx;
				}

				/deep/ .van-cell {
					border: 1px solid red !important;
					padding-top: 10rpx;
					padding-bottom: 10rpx;
					

				}

				.gomap {
					text-decoration: underline;
					color: red;
					font-weight: bold;
					font-size: 26rpx;
					text-align: center;
					margin-top: 60rpx;



				}
			}
		}
	}
</style>
